/* pages/index/weather/weather.wxss */

.weather-bgimg {
    height: 100%;
    width: 100%;
    position: fixed;
    z-index: -1;
    top: 0;
}

.weather-title {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 66rpx;
}

.weather-name {
    color: #ffffff;
    font-size: 30rpx;
}

.weather-local {
    height: 31rpx;
    width: 26rpx;
    margin-right: 20rpx;
}

.observe {
    margin-top: 24rpx;
    text-align: center;
    color: #ffffff;
    font-size: 150rpx;
}

.today-weather {
    font-size: 32rpx;
    margin-left: 24rpx;
}

.wind-air {
    display: flex;
    justify-content: space-around;
    margin-top: 66rpx;
    color: #ffffff;
    align-items: center;
}

.wind, .air {
    width: 49%;
    text-align: center;
}

.line {
    width: 2%;
    height: 28rpx;
    border-left: 2rpx solid #ffffff;
}

.line {
    border-left: 2rpx solid #ffffff;
}

.next-weather {
    display: flex;
}

.weather-icon {
    width: 48rpx;
    height: 48rpx;
    margin: 18rpx 0;
}

.next-weather {
    display: flex;
    justify-content: space-around;
    margin: 0 18rpx;
    margin-top: 14rpx;
    padding: 36rpx 24rpx;
    background: rgba(255, 255, 255, 0.26);
    color: #ffffff;
    font-size: 28rpx;
}

.weather-item {
    text-align: center;
}

.index {
    margin-top: 24rpx;
}

.index-title {
    text-align: center;
    font-size: 36rpx;
    color: #ffffff;
}

.index-info {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0 20rpx;
    margin-top: 16rpx;
    padding: 34rpx 64rpx;
    font-size: 28rpx;
    color: #ffffff;
    background: rgba(255, 255, 255, .1);
}

.index-item {
    display: flex;
    width: 45%;
    margin-top: 14rpx;
}